<template>
  <div>


 <div class="d-flex justify-content-center">
     <div class="searchResult mt-2 col-lg-6 w-100 mr-2">
       <ul class="list-group list-group-flush d-flex align-items-center ">
           <li class="list-group-item tec-blog w-100"  style="cursor:pointer" v-for="(item) in list" :key="item.msgId" >
               <h5 class="card-title  text-truncate">{{item.atitle}}</h5>
               <div class="row no-gutters">
                   <div class="">
                       <div class="card-body  pt-0 pt-lg-2 d-flex flex-column justify-content-center h-100">
                           <p class="card-text tec-text text-muted " v-html="item.content"></p>
                           <div class="d-none d-lg-block text-black-50">
                               <span href="#" class="card-link"><i class="iconfont icon-yonghu "></i>{{item.auid||'mm'}}</span>
                               <span href="#" class="card-link"><i class="iconfont icon-dianzan "></i>{{item.prizeCount||0}}</span>
                               <span href="#" class="card-link"><i class="iconfont icon-chakan "></i>{{item.readNum||0}}</span>
                               <span href="#" class="card-link"><i class="iconfont icon-pinglun"></i>{{item.commentCount||0}}</span>
                               <span class="card-link d-lg-inline d-none">{{item.atime}}</span>
                           </div>
                       </div>

                   </div>
               </div>
               <div class="d-block d-lg-none text-black-50">
                               <span href="#" class="card-link"><i class="iconfont icon-dianzan "></i>{{item.prizeCount}}</span>
                               <span href="#" class="card-link"><i class="iconfont icon-chakan "></i>{{item.readNum}}</span>
                               <span href="#" class="card-link"><i class="iconfont icon-pinglun"></i>{{item.commentCount}}</span>
                               <span class="card-link ">{{item.atime}}</span>
                       </div>
            </li>
       </ul>
       <turnPage  @getNewData='getMessage' :pageCount='pageShow' :articleNum='num'></turnPage>
     </div>
     <div class="sendMsg col-lg-3 d-lg-block d-none bg-white p-2">
       <form class="form-inline mb-2">
         <div class="card-body">
           <div class="form-group ">
             <label for="staticEmail" class="  mr-2  col-form-label">Email</label>
             <input type="password" class="form-control" id="inputPassword2" placeholder="Password">
           </div>
         </div>
          <div class="card-body">
            <div class="form-group ">
              <label for="staticEmail" class=" mr-2 col-form-label">用户名</label>
              <input type="text" class="form-control" id="inputPassword2" placeholder="Password">
            </div>
          </div>
          <div class="card-body w-100">
            <div class="form-group ">
              <label for="staticEmail" class="  mr-2  col-form-label">内容</label>
               <textarea class="form-control" id="deblock_udid" name="deblock_udid" rows="6" style="min-width: 90%"></textarea>
            </div>
          </div>
          <div class="card-body">
           <div class="form-group d-flex justify-content-center">
             <button type="button" class="btn btn-primary mb-2">留言</button>
           </div>
          </div>

       </form>
     </div>

 </div>
 <!-- <foot></foot> -->
  </div>
</template>

<script>
  import turnPage from '../util/turnPage.vue'
  import foot from '../util/footer.vue'
 export default {
   data () {
     return {
        list:[],
        pageShow:0,
        num:0,
     }
   },
   components: {
        turnPage,foot
   },
   created() {
     this.getMessage(1);
     this.getPageNo();
   },
   methods:{
     getMessage(page){
        this.page = page||1;
        console.log('page'+page)
         this.$axios.get(this.$url+"getMsgWall?pageNo="+page||1).then(res=>{

              let tmp = res.data.data;
              tmp.forEach(element => {
                  element.atime = this.$moment(element.atime).format(('YYYY-MM-DD hh:mm:ss'));
              });


              this.list = tmp;

        })
     },
     //获取数量
     getPageNo(){
       this.$axios.get(this.$url+"getMsgWallNumber").then(res=>{
           let tmp = res.data.data[0]['count(msgId)'];

            this.pageShow = Math.ceil(tmp/10);
             this.num = tmp;
             console.log(this.num);

       })
     },
   }
 }
</script>

<style scoped lang='less'>


</style>
